<!-- 编辑面板 -->
<template>
  <div class="p-6">
    <div
      class="mb-5"
      v-for="(statusItem, statusKey) in jsonSchema.status"
      :key="statusKey"
    >
      <template v-if="statusItem?.isShow">
        <component
          :key="statusItem?.id"
          :is="statusItem?.editCom"
          :statusKey="statusKey"
          :editorTitle="editorTitle(statusKey)"
          v-bind="statusItem"
        />
      </template>
    </div>
  </div>
</template>
<script setup lang="ts">
import type { IJsonSchema } from "@/types/common";

const editorTitle = (statusKey: string) => {
  const titleMap = {
    title: "标题内容",
    desc: "描述内容",
    options: "选项设置",
    position: "居中设置",
    titleSize: "标题尺寸",
    titleWeight: "标题加粗",
    titleItatic: "标题倾斜",
    titleColor: "标题颜色",
    descSize: "描述尺寸",
    descWeight: "描述加粗",
    descItatic: "描述倾斜",
    descColor: "描述颜色",
    remarkType: "备注类型",
    inputType: "输入类型",
    width: "宽度设置",
    rateSetting: "评分设置",
    dateType: "日期类型",
  };
  return titleMap[statusKey as keyof typeof titleMap];
};

defineProps<{
  jsonSchema: IJsonSchema;
}>();
</script>

<style scoped></style>
